import { defineConfig, build } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";
import { VitePluginStyleInject } from "./css_vite.mjs";

/**
 * 获取需要编译的入口组件列表
 * @returns
 */
const getBuildItems = () => {
  return [
    {
      entry: path.resolve("./src/components/Async.vue"), // 入口文件地址
      name: "AsyncComponent", // 组件名称
    },
    {
      entry: path.resolve("./src/components/ListWebSite.vue"),
      name: "ListWebSite",
    },
  ];
};

const buildItems = getBuildItems();

buildItems.forEach((item) => {
  build({
    configFile: false,
    resolve: {
      alias: {
        "@": "/src",
        vue: "vue/dist/vue.esm-bundler.js",
      },
    },
    plugins: [
      vue(),
      // less({})
      VitePluginStyleInject(),
    ],
    css: {
      preprocessorOptions: {
        less: {
          // modifyVars: generateModifyVars(),
          javascriptEnabled: true,
          // multipleScopeVars: [],
        },
        // scss:{
        //   additionalData:'@import "./src/assets/main.scss";'
        // }
      },
    },
    publicDir: false, // 忽略public资源包
    build: {
      cssCodeSplit: false, // 禁用 CSS 代码分割
      lib: {
        entry: item.entry,
        formats: ["umd"],
        name: item.name,
      },
      rollupOptions: {
        external: ["vue", "vue-router"],
        output: {
          entryFileNames: () => "[name].[format].js",
          assetFileNames: `[name].[ext]`,
          globals: {
            vue: "Vue",
            "vue-router": "vueRouter",
          },
          dir: `public/remote/${item.name}`, // 固定到对应文件夹中
        },
      },
    },
  });
});
